﻿(function () {
    var Renderer = function (fieldId, nextFallingId, scoreId, levelId) {
        this.field = $(document.getElementById(fieldId));
        this.nextFalling = $(document.getElementById(nextFallingId));
        this.score = $(document.getElementById(scoreId));
        this.level = $(document.getElementById(levelId));

        this._nextFallingClass = "nextFallingClass";
        this._nextFallingSize = 25;
        this._nextFallingCenter = 2;

        this._blockFallingClass = "fallingClass";
        this._blockEarthClass = "earthClass";
        this._blockRowClassPrefix = "blockRow-";
        this._blockSize = 50;
        this._blockFallingCenterX = 2;
        this._blockFallingCenterY = 0;
    };
    Renderer.prototype = {
        renderScore: function (points) {
            this.score.text("" + points);
        },
        renderLevel: function (levelNumber) {
            this.level.text("" + levelNumber);
        },
        _renderFalling: function (fallingObject, fallingClass, blockSize, parentJQueryElement, rowClassPrefix) {
            $("." + fallingClass).remove();

            var div = document.createElement('div');
            div.className = fallingClass;
            div.setAttribute("style", "position:absolute;width:" +
                blockSize + "px;height:" +
                blockSize + "px;border-radius:" +
                blockSize / 3 + "px;");

            for (var i = 0; i < fallingObject.getBody.length; i++) {
                var currentBlock = $(div.cloneNode(true));
                var blockElement = fallingObject.getBody[i];
                currentBlock.css("background-color", blockElement.color);
                currentBlock.css("top", blockElement.coordinate.y * blockSize);
                currentBlock.css("left", blockElement.coordinate.x * blockSize);
                if (rowClassPrefix) {
                    currentBlock.addClass(this._blockRowClassPrefix + blockElement.coordinate.y);
                }

                currentBlock.appendTo(parentJQueryElement);
            }
        },
        eraseRowAnimation: function (rowIndex, duration, engine) {
            duration = duration || 1000;
            $(this._blockRowClassPrefix + rowIndex).fadeOut(duration,function(){
                engine.isAnimating = false;
            });
        },
    };
    Renderer.prototype.renderNextFalling = function (fallingObject) {
        this._renderFalling(fallingObject, this._nextFallingClass,
            this._nextFallingSize, this.nextFalling);
    };
    Renderer.prototype.renderFalling = function (fallingObject) {
        this._renderFalling(fallingObject, this._blockFallingClass,
            this._blockSize, this.field);
    };
    Renderer.prototype.renderEarth = function (earthObject) {
        this._renderFalling(earthObject, this._blockEarthClass,
            this._blockSize, this.field, this._blockRowClassPrefix);
    };
    Renderer.prototype.render = function (newFallingObject, nextFallingObject, earthObject) {
        this.renderFalling(newFallingObject);
        this.renderNextFalling(nextFallingObject);
        this.renderEarth(earthObject);
    };

    tetris.Renderer = Renderer;
})();